<template>
    <div class='singerlist'>
        <button @click="onBack">返回</button>
        <ul>
            <li v-for="(item,index) in list" :key="item.id+index">
                <p>动态：###{{item.actName}}###<br/></p>
                <!-- <p>{{item.tailMark.markTitle}}</p> -->
                <!-- <p>{{item.json.msg}}</p> -->
                <!-- <img :src="item.tailMark.circle.imageUrl" alt="" class="firstpic"> -->
                <span v-for="item in item.pics" :key="item.id">
                    <img :src="item.originUrl" alt="">
                </span>
            </li>
        </ul>
    </div>
</template>

<script>
import axios from "axios"
export default {
    data() {
        return {
            list:[],
            imgUrl:[],
            res:'',
            actname:'',
            acttext:'',
            title:'',
        };
    },
    computed: {},
    watch: {},
    
    methods: {
       async getTopic(id){
            let result = await axios.post(
                `http://192.168.1.107:3000/topic/detail/event/hot?actid=${id}`,
                {
                    withCredentials:true
                });
                console.log(111,result.data.events)
                this.list = result.data.events;
        },    
           
        async onBack(){
            localStorage.removeItem("topicId");
            this.$router.go(-1);
        }, 
    },
    created() {
        const id = localStorage.getItem('topicId');
        console.log(id);
        this.getTopic(id);
    },
    mounted() {
        
    },
    components: {},
    }
</script>
<style scoped>
    .singerlist button{
        width: 60px;
        height: 30px;
        background-color: #eee;
        border:none;
        color:#fff;
    }
    .singerlist li{
        line-height: 26px;
        border: 2px solid rgb(212, 212, 212);
        margin:10px;
        background-color: rgba(245, 210, 210, 0.144);
    }
    li p{
        text-indent: 20px;
    }
    span{
        margin-right:10px;
    }
    /* .firstpic{
        margin-right:20px;
    } */
    img{
        width: 42%;
        margin:0 8px 0 10px;
        height: 200px;
    }
</style>